<!-- APP -->

<template>
  <div id="app">
    <router-view />

    <Socket />
  </div>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'App',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [CORE.mixLoop()],

  /**
   * 组件导入 (Abc.vue + Abc/index.vue)
   */
  components: {
    Socket: () => import(/* webpackChunkName: "Common" */ './Socket'),
  },

  /**
   * 状态数据 (函数返回对象)
   */
  data() {
    return {
      latest: 0, // 最近操作的计时秒数
      overdue: false, // 是否已超时
    }
  },

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 循环秒数 (10秒判断一次)
     */
    LOOP_PERIOD: () => 10,

    /**
     * 无操作秒数 (默认半小时)
     */
    SECOND: () => 1800,

    /**
     * 标题
     */
    TITLE: () => '登录过期',

    /**
     * 提示
     */
    TIP: () => '长时间无操作，请重新登录',

    /**
     * 登录页
     */
    LOGIN() {
      const base = process.env.VUE_APP_RUN
      const login = base.replace(/(\/admin)?$/, '/login')
      const redirect = `?redirect=${base}${this.$route.fullPath}`
      return this.$route.name === 'Home' ? login : `${login}${redirect}`
    },
  },

  /**
   * 挂载完成 (先抽取再调用)
   */
  mounted() {
    // 绑定标记事件
    window.onclick = this.toMark
    window.onmousemove = this.toMark
    window.onkeydown = this.toMark

    window.onbeforeunload = this.toRefresh
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 标记最近操作的计时秒数
     */
    toMark() {
      this.latest = CORE.TIME.second
    },

    /**
     * 按秒循环 (可覆盖)
     */
    toLoop(second) {
      // 未登录
      if (!sessionStorage.TOKEN) return

      // 未超时
      if (second < this.latest + this.SECOND) return

      // 标记超时
      this.overdue = CORE.TIME.stoped = true

      // 弹窗提示
      CORE.ALERT.warning(this.TIP, this.TITLE, { onClose: this.toJump })
    },

    /**
     * 刷新页面时，需要跳转
     */
    toRefresh() {
      this.overdue && this.toJump()
    },

    /**
     * 跳转登录页
     */
    toJump() {
      sessionStorage.clear()
      location = this.LOGIN
    },
  },
}
</script>
